const { defineConfig } = require('@vue/cli-service')
const path = require('path')
const themePath = path.join(__dirname, './src/theme.less')
const cdn = {
  css: ['//cdn.bootcdn.net/ajax/libs/vant/4.6.8/index.min.css'],
  js: [
    '//cdn.bootcdn.net/ajax/libs/vue/2.6.14/vue.min.js',
    '//cdn.bootcdn.net/ajax/libs/vue-router/3.5.1/vue-router.min.js',
    '//cdn.bootcdn.net/ajax/libs/vuex/3.6.2/vuex.min.js',
    '//cdn.bootcdn.net/ajax/libs/vant/2.12.9/vant.min.js',
    '//cdn.bootcdn.net/ajax/libs/axios/1.5.0/axios.min.js'
  ]
}

module.exports = defineConfig({
  publicPath: './',
  outputDir: 'vue2-mobile-2306',
  transpileDependencies: true,
  css: {
    loaderOptions: {
      less: {
        lessOptions: {
          modifyVars: {
            // '.text-color': '#111',
            // 'border-color': 'red',
            // hack: `true; @import "your-less-file-path.less";`
            hack: `true; @import "${themePath}";`
          }
        }
      }
    }
  },
  configureWebpack: {
    // 外部
    externals: {
      // 左边是报名：使用到的名字
      vue: 'Vue',
      'vue-router': 'VueRouter',
      vuex: 'Vuex',
      vant: 'vant',
      axios: 'axios'
    }
  },
  pages: {
    index: {
      entry: 'src/main.js',
      template: 'public/index.html',
      filename: 'index.html',
      cdn: cdn
    }
  }
})
